<!-- 周材高级搜索页面 -->
<template >
    <div class="searchDialog">
        <div class="e-form">
            <el-form
                label-width="120px"
                :model="searchForm"
            >

                <el-row>
                    <el-col :span="12">
                        <el-form-item label="签订日期：" prop="signingStartDate">
                            <el-date-picker type="date" placeholder="请选择日期" value-format="yyyy-MM-dd" v-model="searchForm.startDate" :clearable="false" style="width: 47%;"></el-date-picker>
                            <div class="separ el-icon-minus"></div>
                            <el-date-picker type="date" placeholder="请选择日期" value-format="yyyy-MM-dd" v-model="searchForm.endDate"  :clearable="false" style="width: 47%;"></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>

                <el-row>
                    <el-col :span="24">
                        <el-form-item label="所属机构：" prop="orgId">
                            <el-input
                                v-model="searchForm.orgName"
                                placeholder="请选择"
                                readonly
                            >
                                <i slot="suffix" class="el-input__icon el-icon-document-copy"
                                    @click="onSelectOrg"
                                ></i>
                            </el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row v-if="type===1">
                    <el-col :span="24">
                        <el-form-item label="采购类型：" prop="purchaseType">
                           <check-all :chackdData="procurementTypeObj" @checkdData="onCheckSubTypeFormObj" />
                        </el-form-item>
                    </el-col>

                </el-row>
                <el-row v-if="type===2">
                    <el-col :span="24">
                        <el-form-item label="租赁类型：" prop="purchaseType">
                           <check-all :chackdData="leaseTypeObj" @checkdData="onCheckSubTypeFormObj" />
                        </el-form-item>
                    </el-col>
                </el-row>
                 <el-row >
                    <el-col :span="24">
                        <el-form-item label="状态：" prop="contractState">
                            <check-all :chackdData="stateArr" @checkdData="onCheckStateObj" />
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <div style="display: none;">{{localSearchData}}</div>
    </div>
</template>

<script>
import { mapMutations, mapState } from 'vuex'
// eslint-disable-next-line no-unused-vars
import { selectDataClient, openAppClient } from '@/utils/common'
import CheckAll from '@/components/common/checkAll'
export default {
    components: {
        CheckAll
    },
    data () {
        return {
            searchForm: {
                'endDate': '',
                'orgId': '',
                'purchaseType': [],
                'source': [],
                'startDate': '',
                'state': []
            },
            type: 1, //合同名称：1，分包合同,2，其他合同,3，服务采购合同

            // 状态类型
            stateArr: [
                {
                    value: '0',
                    label: '草稿'
                },
                {
                    value: '1',
                    label: '审核中'
                },
                {
                    value: '2',
                    label: '已审核'
                },
                {
                    value: '5',
                    label: '已作废'
                },

            ],
            // 采购类型
            procurementTypeObj: [
                {
                    value: 0,
                    label: '普通采购'
                },
                {
                    value: 1,
                    label: '集中采购'
                },
            ],
            // 租赁类型
            leaseTypeObj: [
                {
                    value: 0,
                    label: '内租'
                },
                {
                    value: 1,
                    label: '外租'
                },
            ]
        }
    },
    computed: {
        localSearchData () {
            // 默认设置搜索标志为false，则不进行搜索回调
            const searchForm = this.searchForm
            searchForm.searching = false
            this.setSearchData(searchForm)
            return searchForm
        },
        ...mapState({
            state: state => state.equip.equipData.state, //通用流程状态
        }),

    },
    mounted () {
        this.type = Number(this.$route.query.type) || 1
    },
    methods: {
        ...mapMutations(['setSearchData', 'setSelectedInfo']),
        onSelectOrg () {
            selectDataClient({
                SelectServiceToken: '/hr/org/getChildrenOrg', // 客户端对应方法名
                IsSingleMode: false, // 是否单选 true 单选 false 多选
                SelectedIDs: [], // 已选中id(注意：是上一次已选中的id，不是要传的参数，如果第一次选，则传[])
                InitParamsStr: '',    // 接口参数(name为模拟参数)
                Title: '选择机构' // 标题
            }).then(val => {
                this.searchForm.orgId = val[0].orgId
                this.searchForm.orgName = val[0].orgName
            })
        },
        onCheckStateObj (data) {
            this.searchForm.state = data
        },
        // 年度需用计划
        onCheckSubTypeFormObj (data) {
            this.searchForm.purchaseType = data
        },

    },
}
</script>

<style lang="scss">
</style>